<template>
    <el-container class="container">
        <el-header class="header">
            <Header></Header>
        </el-header>
       <el-container>
            <Left></Left>
            <el-main class="main">
                <el-breadcrumb separator="/">
                    <el-breadcrumb-item>系统管理</el-breadcrumb-item>
                    <el-breadcrumb-item>用户管理</el-breadcrumb-item>
                </el-breadcrumb>
                <el-card>
                    <router-view></router-view>
                </el-card>
            </el-main>
        </el-container>
    </el-container>
</template>

<script>
    import Header from "../../components/admin/Header";
    import Left from "../../components/admin/Left";
    import menus from '../../api/menu'

    export default {
        name: "Index",
        components: {Left, Header},
        data() {
            return {
                menus: menus
            }
        }
    }
</script>

<style scoped>
    .container {
        background-color: #f2f2f2;
        position: absolute;
        bottom: 0;
        top: 0;
        left: 0;
        right: 0;
    }
    .header {
        background-color: #036FC8;
        padding: 0 10px;
        width: 100%;
        position: relative;
        top: -5px;
    }
    .main {
        position: absolute;
        left: 210px;
        top: 60px;
        bottom: 0;
        right: 10px;
        padding: 0;
        margin: 0;
    }
    .el-breadcrumb {
        height: 45px;
        line-height: 45px;
        padding: 0;
        margin: 0;
    }
</style>